<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8"/>
    <title>民宿住房服务详情页</title>
    <style>
        body {
            font-family: SimHei;
        }

        input {
            -webkit-appearance: checkbox;
        }

        table {
            font-size: 8px;
            color: #333333;
            width: 100%;
            border-width: 1px;
            border-color: #729ea5;
            border-collapse: collapse;
        }

        th {
            font-size: 8px;
            background-color: #acc8cc;
            border-width: 1px;
            padding: 8px;
            border-style: solid;
            border-color: #729ea5;
            text-align: center;
        }

        tr {
            background-color: #d4e3e5;
        }

        td {
            font-size: 8px;
            border-width: 1px;
            padding: 8px;
            border-style: solid;
            border-color: #729ea5;
            text-align: center;
        }

        #div-head {
            line-height: 50px;
            text-align: center;
        }
    </style>
</head>
<body>
<div class="color pos">
    <h2>尊敬的 [[${realName}]] 房东，您好！</h2>
    <p>你收到一份新的租房交易订单，请尽快安排相关事宜！</p>
    <!-- 表单头标注 -->
    <div id="div-head">
        <b style="font-size: 25px">民宿住房服务订单</b>
    </div>
    <div style="margin: 0; padding: 0">
        <div style="margin: 0; padding: 0; display: inherit; float: left">
            <span>
            订单状态：
            <b th:if="${entity.orderStatus==1}" style="color: darkgray">待支付</b>
            <b th:if="${entity.orderStatus==2}" style="color: deepskyblue">已支付</b>
            <b th:if="${entity.orderStatus==3}" style="color: orange">待入住</b>
            <b th:if="${entity.orderStatus==4}" style="color: lightseagreen">已完成</b>
            <b th:if="${entity.orderStatus==5}" style="color: purple">待评价</b>
            <b th:if="${entity.orderStatus==6}" style="color: red">已评价</b>
          </span>
        </div>
        <div style="margin: 0; padding: 0; display: inherit; float: right">
            <b>订单编号：[[${entity.id}]]</b>
        </div>
    </div>
    <!-- 表-基本信息 -->
    <table border="1">
        <tr>
            <th colspan="7"><b style="font-size: 15px">租房预定</b></th>
        </tr>
        <tr>
            <td colspan="1">房间名称</td>
            <td colspan="6"><b th:text="${houseTitle}"></b></td>
        </tr>
        <tr>
            <td rowspan="2">基本信息</td>
            <td><b>房东姓名</b></td>
            <td colspan="2" th:text="${realName}"></td>
            <td><b>租客姓名</b></td>
            <td colspan="2" th:text="${entity.createUserName}"></td>
        </tr>
        <tr>
            <td><b>预计入住日期</b></td>
            <td colspan="2" style="color: red"
                th:text="${#dates.format(entity.orderStartTime,'yyyy年MM月dd日 HH:mm:ss')}"></td>
            <td><b>预计退房日期</b></td>
            <td colspan="2" style="color: red"
                th:text="${#dates.format(entity.orderEndTime,'yyyy年MM月dd日 HH:mm:ss')}"></td>
        </tr>
        <tr>
            <td rowspan="2">费用详情</td>
            <td><b>预计餐饮费</b></td>
            <td colspan="2">￥ [[${entity.mealCost}]]</td>
            <td><b>预计房费</b></td>
            <td colspan="2">￥ [[${entity.houseCost}]]</td>
        </tr>
        <tr>
            <td><b>预计总费用</b></td>
            <td colspan="2">￥ [[${entity.totalCost}]]</td>
            <td><b>实付订金</b></td>
            <td colspan="2">￥ [[${entity.prePay}]]</td>
        </tr>
        <td><b>支付日期</b></td>
        <td colspan="6" th:text="${#dates.format(entity.prePayDate,'yyyy年MM月dd日 HH:mm:ss')}"></td>
    </table>
</div>
</body>
</html>
